<div class="viewport">
    <div class="overview" style="top: 0px;">
        <div class="action-nav-content">
            <div class="links-section"><div class="mozaic-widget action-menu-container widget-search_action_menu" data-widget="search_action_menu" >
                    <div class="action-nav-header">
                        <div id="stream-info-holder"><div class="mozaic-widget search_stream_info widget-stream_info" data-widget="stream_info" >
                                <h1 class="stream-title" data-mixpanel-context="company">
                                    <i class="icon-stream-type icon-stream-company-small" rel="tooltip" data-title="COLLECTING SIGNALS" data-original-title=""></i>
                                    <span><?php echo $this->streamView->model->name ?></span>
                                </h1>
                                <div class="btn-group settings-stream-menu">
                                    <button data-toggle="dropdown" class="btn btn-small dropdown-toggle"><i class="icon-settings"></i><i class="icon-show-more"></i></button>
                                    <ul class="dropdown-menu pull-left our-dropdown">
                                        <li>
                                            <a class="edit-object" data-id="1000032005" data-type="keyword">
                                                <i class="icon-edit"></i>Edit Stream
                                            </a>
                                        </li>
                                        <li>
                                            <a class="copy-object" data-id="1000032005" data-type="keyword">
                                                <i class="icon-copy"></i>Copy to another view
                                            </a>
                                        </li>
                                        <li>
                                            <a class="download-object" data-id="1000032005">
                                                <i class="icon-historical"></i>Get Historical Data
                                            </a>
                                        </li>
                                        <li>
                                            <a class="customize-signals-button" data-id="1000032005" data-type="keyword">
                                                <i class="icon-signals"></i>Signals Settings
                                            </a>
                                        </li>
                                    </ul>
                                </div><div class="clear"></div>
                                <ul class="stream-filter">
                                    <li>
                                        <p>Searching for:</p>
                                        <span><?php echo $this->streamView->model->query ?></span>
                                    </li>
                                    <div id="custom-sources-info-widget" class="mozaic-widget widget-custom_sources_info" data-widget="custom_sources_info" ></div>
                                </ul><div id="historical-job-info-widget" class="mozaic-widget stream-filter historical-info widget-historical_info" data-widget="historical_info" >
                                </div>
                                <ul class="stream-filter">
                                    <li>
                                        <p>Created on:</p>
                                        <span class="capitalize"><?php echo $this->streamView->model->dateCreated; ?></span>
                                    </li><li class="author-info">
                                        <p>By:</p>
                                        <img src="http://www.gravatar.com/avatar/<?php echo md5(strtolower($this->streamView->model->email)); ?>" class="author-avatar">
                                        <div class="author-inner-wrapper">
                                            <span class="capitalize"><?php echo $this->streamView->model->userId ?></span>
                                            <span class="author-role">Admin</span>
                                        </div>
                                    </li></ul>
                                <div class="clear"></div></div></div>
                        <div class="button-toggle-action_menu"><i class="icon-filter-list"></i><i class="icon-show-more"></i></div>
                        <div class="clear mt-20"></div>
                        <h5 class="action-nav-title">MAIN SECTIONS</h5>
                        <ul class="nav nav-list main-section-nav">
                            <li>
                                <div class="mozaic-widget widget-url active-section" data-widget="url">
                                    <a class="url-widget-link">
                                        <i class="icon-main-menu"></i>
                                        <span>Mentions</span>
                                    </a>
                                </div>
                                <div class="mozaic-widget widget-pin_timeline" data-widget="pin_timeline"></div>
                            </li>
                            <li id="analytics-link-widget" class="mozaic-widget widget-url">
                                <a class="url-widget-link" href="/Metrics">
                                    <i class="icon-main-menu"></i>
                                    <span>Metrics</span>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div></div>
            <div class="filters-section">
                <div class="mozaic-widget widget-search_filter_list" data-widget="search_filter_list" ><h5 class="action-nav-title">FILTER THE DATA</h5>
                    <div class="btn-holder clear-filters" style="display: none;"><button class="btn btn-small"><i class="icon-clear"></i>Clear</button></div><p class="filter-type filter-type-date">date:</p>
                    <div id="date-filter-widget" class="mozaic-widget widget-date_filter" data-widget="date_filter" >
                        <div class="filter-button btn btn-large" rel="tooltip" data-original-title="Filter metrics for a day, a week or as far back as the stream creation date!">
                            <a href="#"><i class="icon-filter"></i><span id="selected_date" class="button-text">Sep 5 - Sep 11</span></a>
                        </div>
                        <div class="filter-overlay action-nav-filtering">
                            <div class="filter-container">
                                <div class="filter-container-mask calendar-container">
                                    <button id="last_week" class="btn btn-red">Last Week</button>
                                    <button id="last_month" class="btn">Last Month</button>
                                    <p class="calendar-info-text">Or select the start &amp; end date:</p>
                                    <div id="date-filter">
                                        
                                        <label for="from">From</label>
                                        <input type="text" id="from" name="from" />
                                        <label for="to">to</label>
                                        <input type="text" id="to" name="to" />
                                    </div>
                                </div>
                                <div class="btn-holder">
                                    <div class="btn filter-back-button"><i class="icon-back"></i>Back</div>
                                </div>
                            </div>
                        </div>
                        </div>
                    <div class="clear"></div><p class="filter-type filter-type-language">language:</p>
                    <div id="language-filter-widget" class="mozaic-widget widget-language_filter" data-widget="language_filter" >
                        <div class="filter-button btn btn-large" rel="tooltip" data-original-title="Filter mentions by a specific language or all languages. We support over 50 languages!">
                            <a><i class="icon-filter"></i><span class="button-text">All languages</span></a>
                        </div>
                        <div class="filter-overlay action-nav-filtering">
                            <div class="filter-container">
                                <div class="filter-container-top">
                                    <input type="text" class="search-box search-filter-box" placeholder="Language">
                                </div>
                                <div class="filter-container-mask filter_scrollbar tiny_scrollbar">
                                    <div class="scrollbar" style="height: 0px;"><div class="track" style="height: 0px;"><div class="thumb"><div class="end"></div></div></div></div>
                                    <div class="viewport">
                                        <div class="overview" style="top: 0px;">
                                            <ul class="results filter-container-list">
                                                <li data-value="" class="back-list-link selected" style="display: none;"><a class="action-color-active"><i class="icon-back-list"></i>All languages</a></li></ul>
                                        </div> 
                                    </div>
                                </div>
                                <div class="btn-holder">
                                    <div class="btn filter-back-button"><i class="icon-back"></i>Back</div>
                                </div>
                            </div>
                        </div></div>
                    <div class="clear"></div><p class="filter-type filter-type-location">location:</p>
                    <div id="location-filter-widget" class="mozaic-widget widget-location_filter" data-widget="location_filter" >
                        <div class="filter-button btn btn-large" rel="tooltip" data-original-title="Filter mentions by all locations, top locations or a specific area. Use the down arrow next to each country to see an expanded list.">
                            <a><i class="icon-filter"></i><span class="button-text">All locations</span></a>
                        </div>
                        <div class="filter-overlay action-nav-filtering">
                            <div class="filter-container">
                                <div class="filter-container-top">
                                    <input type="text" class="search-box search-filter-box" placeholder="Location">
                                </div>
                                <div class="filter-container-mask filter_scrollbar tiny_scrollbar">
                                    <div class="scrollbar"><div class="track"><div class="thumb"><div class="end"></div></div></div></div>
                                    <div class="viewport">
                                        <div class="overview">
                                            <div class="filter-container-list">
                                                <ul class="results"></ul>
                                                <div class="location-lists"><div class="mozaic-widget widget-top_locations_filter" data-widget="top_locations_filter" >
                                                        <div class="available-locations">
                                                            <p class="filter-list-title">Top locations:</p>
                                                            <ul><li data-param="{&quot;country&quot;:&quot;united states&quot;}"><a href="united states"><i class="icon-circle-list"></i> united states</a></li><li data-param="{&quot;country&quot;:&quot;japan&quot;}"><a href="japan"><i class="icon-circle-list"></i> japan</a></li><li data-param="{&quot;country&quot;:&quot;thailand&quot;}"><a href="thailand"><i class="icon-circle-list"></i> thailand</a></li><li data-param="{&quot;country&quot;:&quot;indonesia&quot;}"><a href="indonesia"><i class="icon-circle-list"></i> indonesia</a></li><li data-param="{&quot;country&quot;:&quot;united kingdom&quot;}"><a href="united kingdom"><i class="icon-circle-list"></i> united kingdom</a></li></ul>
                                                        </div>
                                                    </div><div class="mozaic-widget widget-current_location" data-widget="current_location" ></div>
                                                    <p class="filter-list-title">All locations:</p>
                                                    <ul class="all-locations level-list"></ul>
                                                </div>
                                            </div>
                                        </div> 
                                    </div>
                                </div>
                                <div class="btn-holder">
                                    <div class="btn filter-back-button"><i class="icon-back"></i>Back</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="clear"></div><p class="filter-type filter-type-platform">platform:</p>
                    <div id="platform-filter-widget" class="mozaic-widget widget-platform_filter" data-widget="platform_filter" >
                        <div class="filter-button btn btn-large" rel="tooltip" data-original-title="Filter mentions by all or one specific social platform/data source">
                            <a><i class="icon-filter"></i><span class="button-text">All platforms</span></a>
                        </div>
                        <div class="filter-overlay action-nav-filtering">
                            <div class="filter-container">
                                <div class="filter-container-top">
                                    <input type="text" class="search-box search-filter-box" placeholder="Platform">
                                </div>
                                <div class="filter-container-mask filter_scrollbar tiny_scrollbar">
                                    <div class="scrollbar" style="height: 0px;"><div class="track" style="height: 0px;"><div class="thumb"><div class="end"></div></div></div></div>
                                    <div class="viewport">
                                        <div class="overview" style="top: 0px;">
                                            <ul class="results filter-container-list">
                                                <li data-value="" class="back-list-link selected" style="display: none;"><a class="action-color-active"><i class="icon-back-list"></i>All platforms</a></li></ul>
                                        </div> 
                                    </div>
                                </div>
                                <div class="btn-holder">
                                    <div class="btn filter-back-button"><i class="icon-back"></i>Back</div>
                                </div>
                            </div>
                        </div></div>
                    <div class="clear"></div><p class="filter-type filter-type-tag">tag:</p>
                    <div id="tag-filter-widget" class="mozaic-widget widget-tag_filter" data-widget="tag_filter" >
                        <div class="filter-button btn btn-large" rel="tooltip" data-original-title="Review all tagged mentions and Signals or just the ones with a specific tag.">
                            <a><i class="icon-filter"></i><span class="button-text">All tags</span></a>
                        </div>
                        <div class="filter-overlay action-nav-filtering">
                            <div class="filter-container">
                                <div class="filter-container-top">
                                    <input type="text" class="search-box search-filter-box" placeholder="Tag">
                                </div>
                                <div class="filter-container-mask filter_scrollbar tiny_scrollbar">
                                    <div class="scrollbar" style="height: 0px;"><div class="track" style="height: 0px;"><div class="thumb"><div class="end"></div></div></div></div>
                                    <div class="viewport">
                                        <div class="overview" style="top: 0px;">
                                            <ul class="results filter-container-list">
                                                <li data-value="" class="back-list-link selected" style="display: none;"><a class="action-color-active"><i class="icon-back-list"></i>All tags</a></li><li data-value="19993" data-count="0" class="active" style="display: block;"><a class="action-color-active"><i class="icon-circle-list"></i>Influencer</a></li><li data-value="19995" data-count="0" style="display: block;"><a class="action-color-active"><i class="icon-circle-list"></i>Issue</a></li><li data-value="19994" data-count="0" style="display: block;"><a class="action-color-active"><i class="icon-circle-list"></i>Lead</a></li><li data-value="19992" data-count="0" style="display: block;"><a class="action-color-active"><i class="icon-circle-list"></i>News</a></li></ul>
                                        </div> 
                                    </div>
                                </div>
                                <div class="btn-holder">
                                    <div class="btn filter-back-button"><i class="icon-back"></i>Back</div>
                                </div>
                            </div>
                        </div></div>
                    <div class="clear"></div><p class="filter-type filter-type-sentiment">sentiment:</p>
                    <div id="sentiment-filter-widget" class="mozaic-widget widget-sentiment_filter" data-widget="sentiment_filter" >
                        <div class="clear"></div>
                        <div class="radio-options-sentiment"><a data-name="radio_sentiment" data-value="positive" class="radio-filter-item btn btn-large filter-button" rel="tooltip" data-original-title="Positive">
                                <span>positive</span>
                                <i class="icon-positive"></i>
                                <i class="icon-cirlce-background"></i>
                            </a><a data-name="radio_sentiment" data-value="neutral" class="radio-filter-item btn btn-large filter-button" rel="tooltip" data-original-title="Neutral">
                                <span>neutral</span>
                                <i class="icon-neutral"></i>
                                <i class="icon-cirlce-background"></i>
                            </a><a data-name="radio_sentiment" data-value="negative" class="radio-filter-item btn btn-large filter-button" rel="tooltip" data-original-title="Negative">
                                <span>negative</span>
                                <i class="icon-negative"></i>
                                <i class="icon-cirlce-background"></i>
                            </a></div>
                        <div class="clear"></div>
                    </div>
                    <div class="clear"></div><p class="filter-type filter-type-gender">gender:</p>
                    <div id="gender-filter-widget" class="mozaic-widget widget-gender_filter" data-widget="gender_filter" >
                        <div class="clear"></div>
                        <div class="radio-options-gender"><a data-name="radio_gender" data-value="male" class="radio-filter-item btn btn-large filter-button" rel="tooltip" data-original-title="Male">
                                <span>male</span>
                                <i class="icon-male"></i>
                                <i class="icon-cirlce-background"></i>
                            </a><a data-name="radio_gender" data-value="female" class="radio-filter-item btn btn-large filter-button" rel="tooltip" data-original-title="Female">
                                <span>female</span>
                                <i class="icon-female"></i>
                                <i class="icon-cirlce-background"></i>
                            </a></div>
                        <div class="clear"></div>
                    </div>
                    <div class="clear"></div><p class="filter-type filter-type-reach">reach:</p>
                    <!--<div id="reach-filter-widget" class="mozaic-widget widget-reach_filter" data-widget="reach_filter" >
                        <div class="clear"></div>
                        <div class="radio-options-reach"><a data-name="radio_reach" data-value="XS" class="radio-filter-item btn btn-large filter-button" rel="tooltip" data-original-title="&lt; 100">
                                <span>XS</span>
                                <i class="icon-XS"></i>
                                <i class="icon-cirlce-background"></i>
                            </a><a data-name="radio_reach" data-value="S" class="radio-filter-item btn btn-large filter-button" rel="tooltip" data-original-title="100 - 499">
                                <span>S</span>
                                <i class="icon-S"></i>
                                <i class="icon-cirlce-background"></i>
                            </a><a data-name="radio_reach" data-value="M" class="radio-filter-item btn btn-large filter-button" rel="tooltip" data-original-title="500 - 999">
                                <span>M</span>
                                <i class="icon-M"></i>
                                <i class="icon-cirlce-background"></i>
                            </a><a data-name="radio_reach" data-value="L" class="radio-filter-item btn btn-large filter-button" rel="tooltip" data-original-title="1000 - 4999">
                                <span>L</span>
                                <i class="icon-L"></i>
                                <i class="icon-cirlce-background"></i>
                            </a><a data-name="radio_reach" data-value="XL" class="radio-filter-item btn btn-large filter-button" rel="tooltip" data-original-title="5000 - 9999">
                                <span>XL</span>
                                <i class="icon-XL"></i>
                                <i class="icon-cirlce-background"></i>
                            </a><a data-name="radio_reach" data-value="XXL" class="radio-filter-item btn btn-large filter-button" rel="tooltip" data-original-title="&gt; 9999">
                                <span>XXL</span>
                                <i class="icon-XXL"></i>
                                <i class="icon-cirlce-background"></i>
                            </a></div>
                        <div class="clear"></div>
                    </div>-->
                    <div class="clear"></div>
                </div></div>
            <div class="actions-section">
                <div class="mozaic-widget widget-stream_export" data-widget="stream_export" >
                    <div class="data-export-section">
                        <h5 class="action-nav-title">DATA EXPORT</h5>
                        <p class="filter-type">Export mentions as CSV file.</p>
                        <button id="export-mentions" class="filter-button btn export-button"><i class="icon-export-mentions"></i>Mentions</button>
                        <button id="export-trends" class="filter-button btn export-button"><i class="icon-export-trends"></i>Trends</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    params = window.location.href.split('#')[1].split("/");
    $('.url-widget-link').last().attr('href', "/#metrics/" + params[1]);
    $('.url-widget-link').first().attr('href', "/#stream/" + params[1]);
</script>